<template>
    <MenuPage 
        :page.sync="currentPage"
        :size.sync="boardPZ"
        :columns="boardCol"
        :data="boardData"
        :total="boardTotal"
        :loading="loading"
        noDataText="暂无数据"
        @queryFun="getBoardCastList">
        <template slot="search">
            <Button type="primary" @click="showAddAndUpdate($event, 'add')" icon="md-add"
                >发送公告</Button
            >
        </template>
        <Modal
            v-model="sendBoardModal"
            title="发送公告"
            width="800"
            height="700"
            :footer-hide="true"
        >
            <UserBoardcast v-if="sendBoardModal" @hideModal="hideModal"></UserBoardcast>
        </Modal>
        <Modal v-model="modal" title="公告详情" footer-hide class-name="fix-height-modal">
            <div v-html="curNotice.content" style="font-size:14px;" class="noticeContent"></div>
        </Modal>
    </MenuPage>
</template>
<script>
import {
    addBoardCast,
    queryBoardCast,
    updateBoardCast,
    delBoardCast,
    sendToSence,
    sendToUser,
    getNoticeList,
    boardlist_new
} from '@/api/boardcast_new.js';
import UserBoardcast from '@/components/board-cast/userBoardcast.vue';
//import boardlist from "@/view/boardcast/boardcast"
import encryption from '@/libs/encryption.js';
import pageTitle from '@/mixin/pageTitle';
export default {
    components: {
        UserBoardcast
    },
    mixins:[pageTitle],
    data() {
        const validateGroupUserNum = (rule, value, callback) => {
            //验证只能填入数字
            //验证警戒值
            if (value.length > 0) {
                value.forEach((group) => {
                    if (group.userIds.length == 0) {
                        callback(new Error('每组请至少选择一个用户'));
                    } else {
                        callback();
                    }
                });
            } else {
                callback();
            }
        };
        let September = sessionStorage.getItem('November');
        September = JSON.parse(encryption.SelfUseDecrypt(September));
        return {
            USER_ID: September.userId,
            USER_Name: September.nickname,
            isRootDesinger: September.isRootDesinger,
            boardData: [],
            currentPage: 1,
            boardPZ: 10,
            titleObj: {},
            searchBoard: '',
            addBoard: false,
            boardTotal: 0,
            loading: false,
            sendBoardModal: false,
            boardCol: [
                // {
                //     type: 'index'
                // },
                {
                    title: '类型',
                    key: 'type',
                    minWidth: 50,
                    placement: 'top-left',
                    filter: (type) => {
                        return this.typeFilter(type);
                    }
                },
                {
                    type: 'html',
                    title: '内容',
                    key: 'content',
                    minWidth: 200,
                },

                {
                    title: '接收者',
                    key: 'usersMap',
                    tooltip: true,
                    minWidth: 100,
                    filter: (usersMap) => {
                        return Object.values(usersMap)
                            .flat()
                            .map((user) => user.userName)
                            .join(',');
                    }
                },
                //    {
                //         title: '创建时间',
                //         key: 'createTime',
                //         tooltip: true,
                //         placement: 'top-left',
                //         minWidth: 50
                //     },
                {
                    title: '操作',
                    key: 'action',
                    width: 100,
                    placement: 'top-right',
                    opList: [
                        {
                            txt: '删除',
                            type: 'delete',
                            tooltip: true,
                            title: '你确定要删除吗?',
                            fun: this.showDel
                        }
                    ]
                }
            ],
            currentTabComponent: 'sender',
            showDefImg: false,
            showDataList: false,
            // 删除icon
            delicon: require('../../assets/project/delNote-h.png'),
            modal: false,
            curNotice: {}
        };
    },
    mounted() {
        this.getBoardCastList();
    },
    methods: {
        getBoardCastList() {
            let _this = this;
            let params = {};
            params.pageIndex = _this.currentPage || 1;
            params.pageSize = _this.boardPZ || 10;
            params.creator = this.USER_ID;
            queryBoardCast(params)
                .then((data) => {
                    if (data.code == 1) {
                        // _this.boardData = data.data.items;
                        _this.boardTotal = data.data.total;
                        let items = data.data.items;
                        _this.boardData = items;
                        if (_this.boardData.length > 0) {
                            this.showDataList = true;
                            this.showDefImg = false;
                        } else {
                            this.showDataList = false;
                            this.showDefImg = true;
                        }
                    } else {
                        this.showDataList = false;
                        this.showDefImg = true;
                    }
                })
                .finally(() => {
                    this.loading = false;
                });
        },
        typeFilter(type) {
            let types = '';
            if (type == 1) {
                types = '事务公告';
            } else if (type == 3) {
                types = '违规公告';
            }
            return types;
        },
        boardChangeSize(val) {
            this.boardPZ = val;
            this.getBoardCastList();
        },
        getData(page, size) {
            this.loading = true;
            this.currentPage = page;
            this.boardPZ = size;
            this.getBoardCastList();
        },
        boardOnChange(val) {
            this.currentPage = val;
            this.getBoardCastList();
        },
        showAddAndUpdate(obj, type) {
            this.sendBoardModal = true;
        },
        showDel(item) {
            let _this = this;
            delBoardCast(item.id).then((data) => {
                if (data.code == 1) {
                    _this.$Message.info('删除公告成功');
                    _this.getBoardCastList();
                }
            });
        },
        hideModal() {
            this.sendBoardModal = false;
            this.boardOnChange(1);
        },
        changeTab(tab) {
            this.currentTabComponent = tab;
        },
        // 设置为已读
        setRead() {
            this.$refs.setReadRef.setChatAllRead();
        },
        // 计算index
        handleProIndex(key) {
            return (this.currentPage - 1) * this.boardPZ + key + 1;
        },
        // 处理接收者
        handleReviceName(item) {
            let users = Object.values(item.usersMap)
                .flat()
                .map((user) => user.userName);
            let usersStr = users.join(',');
            if (users.length <= 3) {
                return users.join(',');
            } else {
                return usersStr;
            }
        },
        showBoardModal(item) {
            if (event.target.nodeName == 'A' && event.target.href) {
                return;
            }
            this.modal = true;
            this.curNotice = item;
        }
    }
};
</script>
<style scoped>
/*modal 公告样式*/
.noticeContent {
    word-break: break-all;
}
.noticeContent img {
    max-width: 100%;
}

.noticeContent pre {
    white-space: normal;
}
</style>
